<ul ng-show="timefilter.enabled" class="nav navbar-nav navbar-right navbar-timepicker">
  <li>
    <button
      ng-click="toggleRefresh()"
      ng-show="timefilter.refreshInterval.value > 0">
      <i class="fa" ng-class="timefilter.refreshInterval.pause ? 'fa-play' : 'fa-pause'"></i>
    </button>
  </li>

  <li
    ng-show="timefilter.refreshInterval.value > 0 || kbnTopNav.isCurrent('interval') || kbnTopNav.isCurrent('filter')">

    <button ng-click="kbnTopNav.toggle('interval')"
    ng-class="{active: kbnTopNav.isCurrent('interval') }"
    class="navbar-timepicker-auto-refresh-desc">
      <span ng-show="timefilter.refreshInterval.value === 0"><i class="fa fa-repeat"></i> Auto-refresh</span>
      <span ng-show="timefilter.refreshInterval.value > 0">{{timefilter.refreshInterval.display}}</span>
    </button>

  </li>

  <li>
    <button ng-class="{active: kbnTopNav.isCurrent('filter')}"
      ng-click="kbnTopNav.toggle('filter')"
      aria-haspopup="true"
      aria-expanded="false"
      class="navbar-timepicker-time-desc">
      <i aria-hidden="true" class="fa fa-clock-o"></i>
      <pretty-duration from="timefilter.time.from" to="timefilter.time.to"></pretty-duration>
    </button>
  </li>
</ul>
